<template>
    <div>
        <el-form ref="form" style="max-width: 100%; display: flex; flex-wrap: wrap; gap: 20px; margin-top: 20px;"
            label-width="auto" class="demo-ruleForm" status-icon :model="formData">
          
            <el-form-item label="财务人员：" prop="date" style="flex: 1 1 200px;">
                <span>{{ formData.erpPerson.perName }}</span>
            </el-form-item>
            <el-form-item label="单据日期：" prop="number" style="flex: 1 1 200px;">
                <span>{{ formData.billTime }}</span>
            </el-form-item>
            <el-form-item label="单据编号：" prop="number" style="flex: 1 1 200px;">
                <span>{{ formData.billNo }}</span>
            </el-form-item>

            <div class="user-index-body-form-btn" style="flex: 1 1 100%;">
                <el-table border style="width: 100%; max-width: 1520px;" :data="menu">
                    <el-table-column prop="erpAccount.name" label="账户名称" width="500"
                        :cell-style="{ padding: '10px 15px' }" />
                    <el-table-column prop="erpAccountItems[0].eachAmount" label="金额" width="500"
                        :cell-style="{ padding: '10px 15px' }" />
                    <el-table-column prop="erpAccountItems[0].erpInOutItem.remark" label="备注" width="520"
                        :cell-style="{ padding: '10px 15px' }" />
                </el-table>
            </div>

            <div class="index-body tb" style="flex: 1 1 100%; display: flex; flex-wrap: wrap; gap: 20px;">
                <el-form-item label="付款账户：" style="flex: 1 1 200px;">
                    <span>{{ formData.erpAccount.name }}</span>
                </el-form-item>
                <el-form-item label="实付金额：" style="flex: 1 1 200px;">
                    <span>{{ Math.abs(formData.changeAmount) }}</span>
                </el-form-item>

            </div>
        </el-form>
    </div>
</template>

<script setup>
import { ref } from 'vue';
import request from '@/api/request';

let props = defineProps(["data"]);
let emits = defineEmits(["close"]);
let formData = ref({ ...props.data });
console.log(formData.value.id);
const menu = ref([]);
const loadData = () => {
    request({
        url: '/accountHead/findExpendituresfindzz',
        method: "get",
        params: {
            type: '转账',
            id: formData.value.id
        }
    }).then(res => {
        menu.value = res.data;
        console.log(menu.value);
        // 如果需要在此更新 formData 中的其他数据，可以在此处理
    });
}
loadData();
</script>

<style lang='scss' scoped>
.user-index-body-form-btn {
    margin-top: 20px;
}

.index-body {
    margin-top: 20px;
}
</style>
